<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>钱包/发票</title>
    <!-- vue -->
    <script src="../common/js/vue2.js"></script>
    <!-- 引入http-vue-loader -->
    <script src="../common/js/vueLoader.js"></script>
    <!-- 引入样式vant -->
    <script src="../common/ui/vant-ui/ui.js"></script>
  </head>
  <body>
    <div id="app">
      <main-top></main-top>
      <div class="mainCenter">
        <div class="leftContent">
          <div class="jbbgc">
            <top close="true" title="钱包/发票"></top>
            <div class="card">
              <div class="fs14 fwb">我的直豆</div>
              <div class="flex jcsb">
                <div class="flex fbox">
                  <span class="fs32">{{ money }}</span>
                  <span class="fs14 mgl8 mgr8 c9">直豆</span>
                  <span><van-icon name="question-o" size="14" /></span>
                </div>
                <div class="mtag">
                  <van-icon name="diamond-o" size="14" />直豆充值
                </div>
              </div>
              <div class="mgt10">
                <span><van-icon name="info-o" size="12" /></span>
                <span class="fs12 c9">直豆充值可开发票,充值后可随时消费</span>
              </div>
              <div class="van-hairline--bottom pd10 mgb10"></div>
              <div class="flex spanCtxt ">
                <div class="">
                  <span><van-icon name="info-o" size="12" /></span>
                  <span class="fs12">直豆明细</span>
                </div>
                <div class="">
                  <span><van-icon name="info-o" size="12" /></span>
                  <span class="fs12">开发票</span>
                </div>
                <div class="">
                  <span><van-icon name="info-o" size="12" /></span>
                  <span class="fs12">支付设置</span>
                </div>
              </div>
            </div>
          </div>
        </div>
        <lan-adright></lan-adright>
      </div>
      <main-footer></main-footer>
    </div>
  </body>
</html>
<style>
  .fbox {
    align-items: baseline;
  }
  .mtag {
    height: 15px;
    padding: 7px 15px;
  }
  .spanCtxt div {
    flex: 1;
    text-align: center;
    font-weight: bold;
    border-right: 1px solid #eee;
  }
  .spanCtxt div:last-child {
    border-right: none;
  }
  .jbbgc{
    padding-bottom: 10px;
  }
</style>
<script>
  Vue.use(httpVueLoader);
  new Vue({
    el: "#app",
    data: {
      money: 0,
    },
    components: {
      top: httpVueLoader("../common/commpent/top.vue"),
      "main-top": httpVueLoader("../common/commpent/main/workTop.vue"),
      "main-footer": httpVueLoader("../common/commpent/main/mainFooter.vue"),
      "lan-adright": httpVueLoader("../common/commpent/lan/adRight.vue"),
    },
    methods: {},
  });
</script>
